<template>
  <div style="width: 400px;margin: 150px auto">
    <el-form :model="form" ref="form" size="normal">
      <el-form-item>
<!--        隐藏参数id-->
        <el-input v-model="form.id" v-if="false" hidden></el-input>
      </el-form-item>
      <el-form-item label="姓名" prop="username" style="width: 300px; margin: auto;padding-bottom: 10px">
        <el-input v-model="form.username"></el-input>
      </el-form-item>
      <el-form-item label="密码" prop="password" style="width: 300px; margin: auto;padding-bottom: 10px">
        <el-input v-model="form.password" show-password></el-input>
      </el-form-item>
      <el-form-item label="昵称" prop="nickName" style="width: 300px; margin: auto;padding-bottom: 10px">
        <el-input v-model="form.nickName"></el-input>
      </el-form-item>
      <el-form-item label="年龄" prop="age" style="width: 300px; margin: auto;padding-bottom: 10px">
        <el-input v-model="form.age"></el-input>
      </el-form-item>
      <el-form-item label="性别" prop="sex" style="width: 300px; margin: auto;padding-bottom: 10px">
        <el-input v-model="form.sex"></el-input>
      </el-form-item>
      <el-form-item label="地址" prop="address" style="width: 300px; margin: auto;padding-bottom: 10px">
        <el-input v-model="form.address"></el-input>
      </el-form-item>
      <el-form-item style="width: 300px; margin: auto;padding-left: 120px">
        <el-button type="primary" @click="update">保存修改</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import request from "../../utils/request";

export default {
  name: "Person",
  data() {
    return {
      form: {},
    }
  },
  methods: {
    load(){
      //默认值
      this.form.id = JSON.parse(sessionStorage.getItem("user")).id
      this.form.username = JSON.parse(sessionStorage.getItem("user")).username
      this.form.password = JSON.parse(sessionStorage.getItem("user")).password
      this.form.nickName = JSON.parse(sessionStorage.getItem("user")).nickName
      this.form.age = JSON.parse(sessionStorage.getItem("user")).age
      this.form.sex = JSON.parse(sessionStorage.getItem("user")).sex
      this.form.address = JSON.parse(sessionStorage.getItem("user")).address
    },

    //修改
    update(){
      request.put("/user",this.form).then(res=>{
        if (res.code == '0') {  //如果后台返回的数据code为0表示更新成功，若不为0表示更新失败，需要将错误信息显示出来
          //提示信息
          this.$message({
            type: "success",
            message: "更新成功"
          })
        }else {
          this.$message({
            type: "error",
            message: res.msg
          })
        }

        sessionStorage.setItem("user",JSON.stringify(res.data))

        this.load()//更新或者新增后刷新数据
      })
    }
  },
  created() {
    this.load()
  }
}
</script>
<style scoped>

</style>